<template>
    <p ref="aaa">aaaa</p>
	<p :ref="bbb" v-for="(item, index) in 5" :key="index">bbbbb</p>
	<p>{{ ccc }}</p>
</template>
<script lang=''>
    import { defineComponent, toRefs, ref, reactive, toRef, getCurrentInstance, computed, watch, onMounted } from 'vue'
    export default defineComponent({
        beforeRouteEnter(to, from, next){
            next()
        },
        setup(){
            let { proxy: _this } = getCurrentInstance();
			
			// 获取多个dom
			// const bbb_dom = ref([]);
			// const bbb = (el) => {
			// 	arr.value.push(el);
			// };
			
            let data = toRefs(reactive({
				aaa: '',
				bbb_dom: [],
				bbb: function(e){
					_this.bbb_dom.push(e)
				},
				ccc: 'cccc'
            }))
			
            onMounted(function(){
				console.log( _this.aaa );
				console.log( _this.bbb_dom );
				setTimeout(function() {
					_this.ccc = _this.ccc + 1
					console.log( _this.ccc );
				}, 2000);
            })

            let methods = {
			
            }

            let computeds = {
                computed_1: computed(()=>{
                    // return e
                }),
            }

            return{
				// bbb_dom,
				// bbb,
                ...data,
                ...methods,
                ...computeds,
            }
        }
    })
</script>

<style lang='scss' scoped>
</style>